﻿@using Aspire.Dashboard.Resources
@inject IStringLocalizer<ControlsStrings> Loc
@inject IStringLocalizer<Dialogs> DialogsLoc

<div class="@GetContainerClass()" style="width: inherit;">
    @if (EnableMasking && IsMasked)
    {
        <span class="cellText">
            &#x25cf;&#x25cf;&#x25cf;&#x25cf;&#x25cf;&#x25cf;&#x25cf;&#x25cf;
        </span>
    }
    else if (EnableHighlighting)
    {
        <span class="cellText" title="@(ToolTip ?? Value)">
            <FluentHighlighter HighlightedText="@HighlightText"
                               Text="@Value" />
            @ContentAfterValue
        </span>
    }
    else
    {
        <span class="cellText" title="@(ToolTip ?? Value)">
            @(MaxDisplayLength.HasValue ? TrimLength(Value) : Value)
            @ContentAfterValue
        </span>
    }
    @if (EnableMasking)
    {
        <div @onclick:stopPropagation="true">
            <FluentButton Appearance="Appearance.Lightweight"
                          IconEnd="@(IsMasked ? _unmaskIcon : _maskIcon)"
                          Title="@(IsMasked ? Loc[nameof(ControlsStrings.GridValueMaskShowValue)] : Loc[nameof(ControlsStrings.GridValueMaskHideValue)])"
                          OnClick="ToggleMaskStateAsync"
                          aria-label="@(IsMasked ? Loc[nameof(ControlsStrings.GridValueMaskShowValue)] : Loc[nameof(ControlsStrings.GridValueMaskHideValue)])" />
        </div>
    }

    @{
        (string, object)[] uncapturedCopyAttributes = [
            ("alt", PreCopyToolTip),
            ("title", string.Empty),
            ("aria-label", Loc[nameof(ControlsStrings.GridValueCopyToClipboard)]),
            ("tabindex", "0")
        ];
    }

    <div @onclick:stopPropagation="true" class="defaultHidden">
        <FluentButton Appearance="Appearance.Lightweight"
                      Id="@_menuAnchorId"
                      Class="defaultHidden"
                      Style="float: right; flex-shrink: 0"
                      OnClick="@ToggleMenuOpen">
            <FluentIcon Style="display:inline;" Icon="Icons.Regular.Size16.MoreVertical" />
        </FluentButton>

        <FluentMenu Anchor="@_menuAnchorId" @bind-Open="_isMenuOpen" VerticalThreshold="170" HorizontalPosition="HorizontalPosition.End">
            <FluentMenuItem
                Id="@_copyId"
                AdditionalAttributes="@FluentUIExtensions.GetClipboardCopyAdditionalAttributes(ValueToCopy ?? Value, PreCopyToolTip, PostCopyToolTip, uncapturedCopyAttributes)">
                <span slot="start">
                    <FluentIcon Class="copy-icon" Style="display:inline; vertical-align: text-bottom" Icon="Icons.Regular.Size16.Copy" Slot="start" />
                    <FluentIcon Class="checkmark-icon" Style="display:none; vertical-align: text-bottom" Icon="Icons.Regular.Size16.Checkmark" Slot="start" />
                </span>
                @PreCopyToolTip
            </FluentMenuItem>

            <FluentMenuItem
                Disabled="@(Value is null)"
                AdditionalAttributes="@FluentUIExtensions.GetOpenTextVisualizerAdditionalAttributes(Value!, !string.IsNullOrEmpty(TextVisualizerTitle) ? TextVisualizerTitle : ValueDescription)">
                <span slot="start">
                    <FluentIcon Style="display:inline; vertical-align: text-bottom" Icon="Icons.Regular.Size16.Open" Slot="start"/>
                </span>

                @DialogsLoc[nameof(Dialogs.OpenInTextVisualizer)]
            </FluentMenuItem>
        </FluentMenu>
    </div>
</div>
